@import '../../../../../common';
.workflowRunStatus {

  :host-context(.night) & {
    button {
      border-color: rgba(255, 255, 255, 0.85);
    }
    .success {
      background-color: $darkTheme_night_green;
      border: 2px solid $darkTheme_green;
      border-top: none;
    }

    .fail {
      background-color: $darkTheme_night_red;
      border: 2px solid $darkTheme_red;
      border-top: none;
    }

    .building {
      background-color: $darkTheme_night_blue;
      border: 2px solid $darkTheme_blue;
      border-top: none;
    }

    .inactive {
      background-color: $darkTheme_night_grey;
      border: 2px solid grey;
      border-top: none;
    }
  }

  .center {
    text-align: center;
  }

  .alignRight {
    text-align: right;
  }

  nz-card {
    z-index: 2;
  }

  nz-row:not(:last-child) {
    margin-bottom: 15px;
  }

  nz-row.bordered {
    padding-top: 15px;
    border-top: 1px solid rgba(34,36,38,.1);
  }

  button {
    i {
      margin-right: inherit;
    }
  }

  i {
    margin-right: 5px;
  }

  .success {
    background-color: $cds_color_light_green;
    border: 2px solid $cds_color_green;
    border-top: none;
  }

  .fail {
    background-color: $cds_color_light_red;
    border: 2px solid $cds_color_red;
    border-top: none;
  }

  .inactive {
    background-color: $cds_color_light_grey;
    border: 2px solid grey;
    border-top: none;
  }

  .building {
    background-color: $cds_color_light_teal;
    border: 2px solid $cds_color_teal;
    border-top: none;
  }

  .semicircle {
    width: 3em;
    position: absolute;
    height: 3em;
    border: 2px solid black;
    border-radius: 50% !important;
    margin: 0 auto 0em auto;
    bottom: -1.5em;
    left: calc(50% - 1.5em);
    z-index: 1;
    cursor: pointer;

    i {
      font-size: 1em;
      position: absolute;
      bottom: 3px;
      left: 30%;
    }

    &.success {
      border-color: $cds_color_green;
    }

    &.fail {
      border-color: $cds_color_red;
    }

    &.inactive {
      border-color: grey;
    }

    &.building {
      border-color: $cds_color_teal;
    }
  }

  .black {
    background-color: #141414;
  }
  .scrollable {
    max-height: 300px;
    overflow-y: auto;
    padding: 1em 1.5em;
    color: white;
    border-radius: 3px;
  }

  pre {
    white-space: pre-line;
    font-size: 0.9em;
  }
}
